import React from 'react'
import ReactDOM from 'react-dom'    
import  List from '../../component/List/List'//list
// import './css/List.css'
 import man from './assets/ListDemo/man.png'

class ListDemo extends React.Component {
    constructor(props) {
        super(props);
        this.state = {  
        };
    }
    listConfig = {
        width:  350,         
        theme:'default', 
        leftIcon:{
            img:man,
            itemStyle:{
                width:45,height:45
            },
            itemClick: (e,item) => {
                this.listClick(e,item)
            }   
        },
       dataConfig:[ 
           {
                key:'name',
                itemStyle:{ width: '100%',    paddingRight: '95px', 'box-sizing': 'border-box' },
                itemClick: (e,item) => {
                  this.listClick(e,item)
                }   
            },{
                key:'re_tm',
                itemStyle:{width:95,   position: 'absolute',right:0,top:'10px',color:'#B8B8B8'},
                itemClick: (e,item) => {
                    this.listClick(e,item) 
                }            
            },{
                key:'re_user_name',
                type:'img', //图片类型的
                itemStyle:{  display: 'inline',color:'#858585'},
                itemClick: (e,item) => {
                     this.listClick(e,item) 
                }              
            },{
                key:'files', 
                type:'download', //下载类型，
                itemStyle:{  display: 'inline',color:'#858585'},
                itemClick: (e,item) => {
                  this.listClick(e,item) 
                }                 
            },
            {
                key:'docfiles', 
                type:'download', //下载类型，
                itemStyle:{  display: 'inline',color:'#858585'},
                itemClick: (e,item) => {
                  this.listClick(e,item) 
                }                 
            }
        ] 
    }
    listData=[
        {
            name:"关于防洪预案的沟通",
            time:"10-19 18 00",  
            responName:"***（防洪办）",
            responC:"***（防洪办）",
            re_user_name:'../assets/weather/阴big.png',
            files:{
                filetype:'.png',//图片类型的点击弹窗显示
                href:'../assets/weather/阴big.png',
                name:'天气图片'
            },
            docfiles:{
                filetype:'.doc',//不是图片类型的点击下载
                href:'../assets/weather/阴big.doc',
                name:'文档图片'
            }
        },
        {
            name:"sd23",
            time:"23", 
          
        }
    ]
    listClick = (item) => {
        console.log(item)
    }

     componentWillMount = () => {
 
    } 
    componentDidMount = () => {
         this.info.boxW = document.documentElement.clientWidth  || document.body.clientWidth; 
    } 

    info={
        boxW:360,
    }

 
    render() {
        return (
            <div  className="ListDemo">
               <List  listConfig={this.listConfig}  listData={this.listData}   ></List>
            </div>
        )
    }
} 
export default ListDemo 